* {
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;
}

body {
    font-family: montserrat;
    // background-color: #2e3458;
}

// 轮播图
.banner {
    height: 630px;
    width: 100%;
    // background-color: #2c3e5044;
    margin-top: 80px;
    overflow: hidden;

    .swiper {
        height: 630px;
        width: 100%;

        img {
            height: 630px;
            width: 100%;
        }
    }
}

.content {
    height: auto;
    width: 1506px;
    // background-color: #bebebe;
    margin: 0 auto;
    margin-top: 20px;

    .hit-movie,
    .premiere-theater,
    .homemade-movie,
    .Film-review-column,
    .Featured-planning,
    .Best-Film-Awards {
        .box-title {
            height: 70px;
            width: 85%;
            margin: 0 auto;
            padding-top: 12px;

            span {
                font-size: 30px;
                font-weight: 550;
                color: #2e3458;
                transition: all .3s;
                // margin-top: 12px;
            }
        }

        // PC小方块
        .pc_min {
            // height: 400px;
            width: 85%;
            margin: 0 auto;
            // background-color: #25a000;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;

            .min_box:nth-child(1) {
                margin-left: 0px;
            }

            .min_box:nth-child(7) {
                margin-left: 0px;
            }

            .min_box {
                height: auto;
                width: 198px;
                margin-left: 18.4px;
                margin-bottom: 10px;

                .min_img {
                    height: 111px;
                    width: 100%;
                    // background-color: #1b9bff;
                    transition: all .5s;
                    border-radius: 5px;
                    margin-bottom: 18px;

                    .back_img_wh {
                        border-radius: 5px;
                        width: 100%;
                        height: 100%;
                    }
                }

                .min_img:hover {
                    transform: scale(1.2);
                    box-shadow: 0 15px 30px rgba(0, 0, 0, .1);
                }

                .introduce {
                    height: auto;
                    width: 100%;
                    // background-color: #ffb8fb;

                    span:nth-child(1) {
                        display: block;
                        font-size: 15px;
                        color: #2e3458;
                        font-weight: bold;
                        margin-bottom: 5px;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }

                    a:hover {
                        span:nth-child(1) {
                            color: #1b9bff;
                        }
                    }

                    span:nth-child(2) {
                        display: block;
                        font-size: 10px;
                        color: #999;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }
            }
        }

        // 小方块移动端
        .mobile_min {
            height: auto;
            width: 100%;
            // background-color: #25a000;
            flex-direction: row;
            flex-wrap: wrap;
            display: none;

            .min_box:nth-child(1) {
                margin-left: 6px;
                margin-right: 17px;
            }

            .min_box:nth-child(3) {
                margin-left: 6px;
                margin-right: 17px;
            }

            .min_box {
                height: auto;
                width: 180px;
                margin-bottom: 15px;

                .min_img {
                    height: 100px;
                    width: 100%;
                    // background-color: #1b9bff;
                    border-radius: 5px;
                    margin-bottom: 10px;

                    .back_img_wh {
                        width: 100%;
                        height: 100%;
                        border-radius: 5px;
                    }
                }

                .introduce {
                    height: auto;
                    width: 100%;
                    // background-color: #ffb8fb;

                    span:nth-child(1) {
                        display: block;
                        font-size: 15px;
                        color: #2e3458;
                        font-weight: bold;
                        margin-bottom: 5px;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }

                    span:nth-child(2) {
                        display: block;
                        font-size: 10px;
                        color: #999;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }
            }
        }

        // pc大方块显示
        .pc_max {
            // height: 760px;
            width: 85%;
            // background-color: #25a000;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            margin: 0 auto;

            .pc_box:nth-child(1) {
                margin-left: 0;
            }

            .pc_box:nth-child(7) {
                margin-left: 0;
            }

            .pc_box {
                height: 345px;
                width: 195px;
                margin-left: 20px;
                margin-bottom: 10px;

                .pc_main {
                    display: block;
                    height: 277px;
                    width: 198px;
                    border-radius: 5px;
                    // background-color: #0cd1d8;
                    margin-bottom: 20px;
                    transition: all .3s;
                    z-index: 2;
                    overflow: hidden;

                    .back_img {
                        .back_img_wh {
                            width: 100%;
                            height: 100%;
                        }
                    }
                }

                .pc_main:hover {
                    transform: scale(1.2);
                    box-shadow: 0 15px 30px rgba(0, 0, 0, .1);
                }

                .introduce {
                    height: auto;
                    width: 198px;
                    // background-color: #ffb8fb;
                    z-index: 1;

                    span:nth-child(1) {
                        display: block;
                        font-size: 15px;
                        font-weight: bold;
                        color: #2e3458;
                        margin-bottom: 5px;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }

                    a:hover {
                        span:nth-child(1) {
                            color: #1b9bff;
                        }
                    }

                    span:nth-child(2) {
                        display: block;
                        color: #999;
                        font-size: 13px;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }
            }
        }

        // 大方块移动端显示
        .mobile_max {
            height: auto;
            width: 100%;
            // background-color: #25a000;
            flex-direction: row;
            flex-wrap: wrap;
            display: none;

            .pc_box {
                height: auto;
                width: 120px;
                margin-left: 5px;
                margin-bottom: 20px;
                flex: 1;

                .pc_main {
                    display: block;
                    height: 165px;
                    width: 120px;
                    border-radius: 5px;
                    // background-color: #0cd1d8;
                    margin-bottom: 10px;
                    transition: all .3s;
                    overflow: hidden;

                    .back_img_wh {
                        width: 100%;
                        height: 100%;
                        border-radius: 5px;
                    }
                }

                .introduce {
                    height: auto;
                    width: 100%;
                    // background-color: #ffb8fb;

                    span:nth-child(1) {
                        display: block;
                        font-size: 15px;
                        color: #2e3458;
                        font-weight: bold;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                        overflow: hidden;
                        margin-bottom: 5px;
                    }

                    span:nth-child(2) {
                        display: block;
                        color: #999;
                        font-size: 10px;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }
            }
        }

        // PC超大长方块
        .pro-box-pc {
            width: 85%;
            // background-color: #25a000;
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            margin: 0 auto;

            .cont-box:nth-child(1) {
                margin-left: 0px;
            }

            .cont-box {
                height: auto;
                width: 414px;
                // background-color: #999;
                margin-left: 18.5px;
                flex: 1;

                .cont-img {
                    height: 232px;
                    width: 100%;
                    // background-color: #1b9bff;
                    border-radius: 5px;
                    margin-bottom: 20px;
                    transition: all .3s;
                    z-index: 2;
                    overflow: hidden;

                    .back_img_wh {
                        width: 100%;
                        height: 100%;
                        border-radius: 5px;
                    }
                }

                .cont-img:hover {
                    transform: scale(1.2);
                    box-shadow: 0 15px 30px rgba(0, 0, 0, .1);
                }

                .introduce {
                    height: auto;
                    width: 198px;
                    // background-color: #ffb8fb;
                    z-index: 1;

                    span:nth-child(1) {
                        display: block;
                        font-size: 15px;
                        font-weight: bold;
                        color: #2e3458;
                        margin-bottom: 5px;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }

                    a:hover {
                        span:nth-child(1) {
                            color: #1b9bff;
                        }
                    }
                }
            }
        }

        // 移动端长方块
        .pro-box-min {
            height: auto;
            width: 100%;
            // background-color: #25a000;
            flex-direction: column;
            flex-wrap: wrap;
            display: none;

            .cont-box {
                height: auto;
                width: 100%;
                flex: 1;

                .cont-img {
                    display: block;
                    height: 175px;
                    width: 95%;
                    border-radius: 5px;
                    // background-color: #0cd1d8;
                    margin: 0 auto;
                    margin-bottom: 10px;
                    transition: all .3s;
                    overflow: hidden;
                }

                .introduce {
                    height: auto;
                    width: 100%;
                    // background-color: #ffb8fb;
                    z-index: 1;
                    text-align: center;

                    span:nth-child(1) {
                        display: block;
                        font-size: 15px;
                        font-weight: bold;
                        color: #2e3458;
                        margin-bottom: 5px;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }
            }
        }
    }
}

// 页脚
footer {
    height: 250px;
    width: 100%;
    background-color: #2e3458;
    border-top: 2px solid #1b9bff;
    margin-top: 75px;
    color: #fff;

    .foot_content {
        height: auto;
        width: auto;
        margin: 0 auto;
        margin-top: 55px;
        // background: #71ff71;
        text-align: center;
        font-size: 20px;

        p {
            margin-bottom: 10px;
        }
    }
}

@media(max-width:950px) {
    .banner {
        height: 165px;

        .swiper {
            height: 165px;

            img {
                height: 165px;
                width: 100%;
                // margin: 0 auto;
            }

            .swiper-button-prev {
                display: none;
            }

            .swiper-button-next {
                display: none;
            }
        }
    }

    .content {
        height: auto;
        width: 100%;
        // background-color: #2e3458;
        margin: 0 auto;

        .hit-movie,
        .premiere-theater,
        .homemade-movie,
        .Film-review-column,
        .Featured-planning,
        .Best-Film-Awards,
        .cat-piece,
        .tough-guy-movie,
        .Movie-Inventory {
            height: auto;
            width: 100%;
            margin: 0 auto;
            // background-color: #ff9e71;

            .box-title {
                height: 50px;
                width: 100%;
                // background-color: #71ff71;
                line-height: 50px;
                padding-top: 0px;

                span {
                    font-size: 20px;
                    font-weight: bold;
                    color: #2e3458;
                    padding-left: 10px;
                }
            }

            .pc_max {
                display: none;
            }

            .mobile_max {
                display: flex;
            }

            .pc_min {
                display: none;
            }

            .mobile_min {
                display: flex;
            }

            .pro-box-pc {
                display: none;
            }

            .pro-box-min {
                display: flex;
            }
        }
    }

    footer {
        height: 145px;

        .foot_content {
            height: auto;
            margin-top: 25px;
            font-size: 10px;
        }
    }
}